.sub_visual {
    margin-bottom: 105px;
    margin-top: 50px
}
.sub_visual ul {
    display: table;
    vertical-align: middle
}
.sub_visual ul li {
    display: table-cell;
    width: 50%;
    vertical-align: middle
}
.sub_visual ul li h2 {
    font-size: 80px;
    color: #e4185d
}
.sub_visual ul li img {
    width: 100%
}
.sub_visual ul li p {
    float: right;
    width: 88%;
    margin-top: 38px;
    padding-left: 2%;
    font-size: 40px;
    box-sizing: border-box;
    word-break: keep-all
}
.sub_visual ul li p.large {
    width: 91%
}
.sub_visual ul li p span.col01 {
    color: #e4185d
}
.sub_visual ul li p span.col02 {
    color: #5ac102
}
.sub_visual ul li p span.col03 {
    color: #4972f6
}
.sub_visual ul li p span.col04 {
    color: #656566
}
.sub_visual ul li p span.col05 {
    color: #222e77
}
.sub_container{
	margin-left: -4%;
	width: 100%;
	z-index: 9;
}
.sub_container ul {
    overflow: hidden
}
.sub_container ul li {
/*    float: left;*/
    position: relative;
    width: 52%;
	margin: 0 auto 0 auto;
	display: block;
}
.sub_container ul li>img {
    width: 100%;
    display: block
}
.sub_container.rightType ul li {
    float: right
}
.sub_container ul li.textPart {
    box-sizing: border-box;
    padding: 6.843% 5% 0 6.843%
}
.sub_container ul li.textPart span {
    display: block;
    font-size: 1.171875vw;
    line-height: 1
}
.sub_container ul li.textPart h3 {
    margin-bottom: 4.747%;
    margin-top: 2%;
    font-size: 60px;
    line-height: 1;
    font-weight: 500;
    color: #333
}
.sub_container ul li.textPart p {
    margin-bottom: 4.747%;
    font-size: 16px;
    color: #444;
    line-height: 26px;
    width: 85%
}
.sub_container ul li.textPart p i {
    font-size: 60px;
    display: block;
    float: left;
    margin-right: 20px
}
.sub_container ul li.textPart .last {
    color: #666;
    font-size: 1.015625vw
}
.sub_container ul li.textPart span.col01 {
    color: #e41957
}
.sub_container ul li.textPart span.col02 {
    color: #e41957
}
.sub_container ul li.textPart span.col03 {
    color: #3fc2cd
}
.sub_container ul li.textPart span.col04 {
    color: #fdcf2e
}
.sub_container ul li.textPart span.col05 {
    color: #5ac102
}
.sub_container ul li.textPart span.col06 {
    color: #783dbe
}
.sub_container ul li.textPart span.col07 {
    color: #4a72f6
}
.sub_container ul li.textPart span.col08 {
    color: #20252e
}
.sub_container ul li.textPart span.col09 {
    color: #e3175c
}
.sub_container dl dd img {
    width: 100%
}
.sub h4 {
    font-size: 46px;
    text-align: center
}
.sub .sub_text {
    margin-bottom: 35px;
    font-size: 22px;
    text-align: center;
    word-break: keep-all;
    color: #333
}
.sub .sub_text p {
    font-size: 1vw;
    color: #e1e1e1
}
.sub h4 .col02 {
    color: #e2195d
}
.sub .sub_text span.col01 {
    color: #e2195d
}
.website_con01 {
    margin-bottom: 120px;
}
.website_con02 {
    margin-bottom: 180px
}
.website_con02 ul {
    overflow: hidden
}
.website_con02 ul li {
    position: relative;
    float: left;
    width: 50%
}
.website_con02 ul li img {
    width: 100%
}
.website_con02 ul li p {
    position: absolute;
    top: 6%;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 2vw;
    color: #000;
    letter-spacing: -.05em;
    font-weight: 700
}
.website_con02 ul li p.hver {
    color: #fff
}
.website_con03 {
    margin-bottom: 180px
}
.website_con03 .img_part img {
    width: 100%;
    display: block
}
.inner_type .container01 {
    margin-bottom: 100px
}
.mobile_con01 {
    margin-bottom: 120px
}
.mobile_con02 {
    margin-bottom: 180px
}
.mobile_con02 ul {
    overflow: hidden;
    background: #202020
}
.mobile_con02 ul li {
    position: relative;
    float: left;
    width: 33.333%;
    overflow: hidden
}
.mobile_con02 ul li img {
    width: 100%;
    display: block;
    -webkit-animation-duration: .8s;
    animation-duration: .8s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}
.mobile_con02 ul li .text_t {
    position: absolute;
    top: 10%;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center
}
.mobile_con02 ul li .text_t h6 {
    font-size: 26px;
    color: #e2195d;
    font-weight: 400
}
.mobile_con02 ul li .text_t p {
    position: absolute;
    top: 22%;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 1.40625vw;
    color: #fff;
    letter-spacing: -.025em;
    opacity: .5;
    font-weight: 300
}
.mobile_con02 ul li .text_t span {
    font-size: 16px;
    color: #fff;
    opacity: .7;
    width: 80%;
    margin: 10px auto;
    display: block
}
.server_con01 {
    margin-bottom: 120px
}
.server_con02 {
    margin-bottom: 180px
}
.server_con02 ul {
    overflow: hidden;
    background: #202020
}
.server_con02 ul li {
    position: relative;
    float: left;
    width: 33.333%;
    overflow: hidden
}
.server_con02 ul li img {
    width: 100%;
    display: block;
    -webkit-animation-duration: .8s;
    animation-duration: .8s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}
.server_con02 ul li .text_t {
    position: absolute;
    top: 6%;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center
}
.server_con02 ul li .text_t h6 {
    font-size: 26px;
    color: #e2195d;
    font-weight: 400
}
.server_con02 ul li .text_t p {
    position: absolute;
    top: 22%;
    left: 0;
    width: 100%;
    text-align: center;
    font-size: 1.40625vw;
    color: #fff;
    letter-spacing: -.025em;
    opacity: .5;
    font-weight: 300
}
.server_con02 ul li .text_t span {
    font-size: 16px;
    color: #fff;
    opacity: .7;
    width: 80%;
    margin: 10px auto;
    display: block
}
.design_con01 {
    margin-bottom: 120px
}
.design_con02 {
    margin-bottom: 180px
}
.container02 {
    width: 100%
}
.container02 ul {
    overflow: hidden
}
.container02 ul li {
    position: relative;
    float: left;
    width: 25%;
    font-size: 0;
    overflow: hidden
}
.container02 ul li img {
    width: 100%;
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    -o-transition: all .4s linear;
    -ms-transition: all .4s linear;
    transition: all .4s linear;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}
.container02 ul li:hover img {
    -webkit-transform: scale(1.2, 1.2);
    -moz-transform: scale(1.2, 1.2);
    -o-transform: scale(1.2, 1.2);
    -ms-transform: scale(1.2, 1.2);
    transform: scale(1.2, 1.2);
    -webkit-transition: all .4s linear;
    -moz-transition: all .4s linear;
    -o-transition: all .4s linear;
    -ms-transition: all .4s linear;
    transition: all .4s linear
}
.software_con01 {
    margin-bottom: 120px
}
.software_con02 {
    margin-bottom: 180px
}
.software_con02 .inner_box {
    background: #20252e;
    padding: 90px 0
}
.software_con02 .inner_box.no02 {
    background: #1d222a
}
.software_con02 .inner_box h5 {
    opacity: 0;
    font-size: 2.34375vw;
    text-align: center;
    color: #fff;
    letter-spacing: -.025em;
    opacity: 1 \0/IE8+9
}
.software_con02 .inner_box .soft_stext {
    opacity: 0;
    margin: 1% 0 3%;
    font-size: 1.171875vw;
    color: #888;
    text-align: center;
    word-break: keep-all;
    opacity: 1 \0/IE8+9
}
.software_con02 .inner_box ul {
    font-size: 0;
    text-align: center
}
.software_con02 .inner_box ul li {
    opacity: 0;
    display: inline-block;
    width: 18.1640625%;
    margin: 0 1.8% 2.25%;
    vertical-align: top;
    opacity: 1 \0/IE8+9
}
.software_con02 .inner_box ul li img {
    width: 100%
}
.software_con02 .inner_box ul li h6 {
    margin-bottom: 4%;
    font-size: 1.171875vw;
    color: #e4175c;
    letter-spacing: -.025em
}
.software_con02 .inner_box ul li p {
    margin-top: 5%;
    font-size: 1.09375vw;
    color: #888
}
.software_con02 .inner_box a {
    opacity: 0;
    opacity: 1 \0/IE8+9;
    display: block;
    margin: 1.8% auto 0;
    padding: 1.2% 0;
    width: 10.368852459%;
    text-align: center;
    color: #a7a7a8;
    font-size: 1.09375vw;
    background: #13161b;
    border: 1px solid #090909
}
.software_con02 .inner_box a i {
    margin: 1.5% 0 0 10%;
    color: #3e4145;
    font-size: 1.3671875vw
}
.software_con02 .inner_box.on h5 {
    -webkit-animation: fadeInUp .7s .1s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp .7s .1s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp .7s .1s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp .7s .1s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards
}
.software_con02 .inner_box.on .soft_stext {
    -webkit-animation: fadeInUp .7s .2s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp .7s .2s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp .7s .2s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp .7s .2s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards
}
.software_con02 .inner_box.on ul li {
    -webkit-animation: fadeInUp .7s .3s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp .7s .3s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp .7s .3s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp .7s .3s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards
}
.software_con02 .inner_box.on ul li:nth-of-type(n+5) {
    -webkit-animation: fadeInUp .7s .4s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp .7s .4s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp .7s .4s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp .7s .4s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards
}
.software_con02 .inner_box.on a {
    -webkit-animation: fadeInUp .7s .5s 1 cubic-bezier(.77, 0, .175, 1);
    -moz-animation: fadeInUp .7s .5s 1 cubic-bezier(.77, 0, .175, 1);
    -o-animation: fadeInUp .7s .5s 1 cubic-bezier(.77, 0, .175, 1);
    animation: fadeInUp .7s .5s 1 cubic-bezier(.77, 0, .175, 1);
    animation-fill-mode: forwards;
    -webkit-animation-fill-mode: forwards
}
.port_tab {
    padding: 140px 0
}
.port_tab ul {
    font-size: 0;
    text-align: right;
    width: 100%
}
.port_tab ul li {
    display: inline-block;
    width: 15%;
    border: 1px solid #d6d6d6;
    border-left: 0;
    box-sizing: border-box;
    text-align: center;
    vertical-align: top
}
.port_tab ul li:first-child {
    border-left: 1px solid #d6d6d6
}
.port_tab ul li img {
    display: block;
    width: 62.2%;
    margin: 0 auto 8%
}
.port_tab ul li.on, .port_tab ul li:hover {
    background: #e41957;
    color: #fff;
    border: 1px solid #e41957
}
.port_tab ul li>a {
    overflow: hidden;
    display: block;
    padding: 5% 0;
    font-size: .78125vw
}
.port_tab ul li.on>a, .port_tab ul li:hover>a {
    color: #fff
}
.contact ul li:first-child {
    width: 56.6967%
}
.contact ul li:last-child {
    width: calc(100% - 56.6967%);
    text-align: right
}
.contact ul li:first-child dl {
    float: right;
    margin-top: 3%;
    width: 85%;
    padding-right: 5.7%
}
.contact ul li:first-child dl dd {
    display: inline-block;
    vertical-align: middle;
    font-size: 1.09375vw;
    color: #666;
    line-height: 1
}
.contact ul li:first-child dl dt {
    display: inline-block;
    vertical-align: middle
}
.contact ul li:first-child dl dt {
    width: 3.535%;
    margin: 0 .5% 0 4%
}
.contact ul li:first-child dl dd a {
    font-size: 1.640625vw;
    color: #000
}
.contact ul li:first-child dl dd a.num {
    font-size: 1.7578125vw;
    color: #e41957;
    cursor: default
}
.contact_con01 {
    padding: 75px 2.8% 137px;
    margin-bottom: 95px;
    background: #f8f8f8
}
.contact_con01 h4 {
    margin-bottom: 70px;
    font-size: 2.734375vw;
    text-align: center
}
.contact_con01 ul {
    overflow: hidden
}
.contact_con01 ul li {
    float: left;
    width: 100%;
    overflow: hidden;
    margin-bottom: 25px
}
.contact_con01 ul li.half {
    width: 50%
}
.contact_con01 ul li p {
    float: left;
    width: 9.1796vw;
    line-height: 70px;
    box-sizing: border-box;
    font-size: 1.484375vw
}
.contact_con01 ul li p span {
    color: #e41957
}
.contact_con01 ul li.no02 p {
    padding-left: 7%
}
.contact_con01 ul li>div {
    float: left;
    width: calc(100% - 9.1796vw)
}
.contact_con01 ul li>div input {
    width: 100%;
    height: 70px;
    box-sizing: border-box;
    font-size: 1.2vw;
    padding: 10px;
    border: 1px solid #d5d3d3;
    background: #fff
}
.contact_con01 ul li>div input.col01 {
    border: 1px solid #e41957
}
.contact_con01 textarea {
    resize: none;
    width: 100%;
    height: 260px;
    padding: 15px;
    font-size: 1.2vw;
    box-sizing: border-box;
    border: 1px solid #d5d3d3;
    margin: 0!important
}
.contact_con01 .agree_wrap {
    padding: 25px 0
}
.contact_con01 .agree_wrap input {
    width: 1.171875vw;
    height: 1.171875vw;
    vertical-align: middle
}
.contact_con01 .agree_wrap label {
    font-size: 1.328125vw;
    letter-spacing: -.075em;
    color: #444
}
.contact_con01 .agree_wrap a {
    float: right;
    display: inline-block;
    padding: 1% 0;
    width: 10.368852459%;
    text-align: center;
    color: #fff;
    font-size: 1.328125vw;
    background: #8b8e97
}
.contact_con01 .btn a {
    display: block;
    margin: 3% auto 0;
    padding: 1.2% 0;
    width: 16%;
    text-align: center;
    color: #fff;
    font-size: 1.6796875vw;
    background: #e41957
}
.sub_container ul li .inner {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden
}
.sub_container ul li .inner img {
    display: block;
    position: absolute;
    z-index: 10;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    -ms-transition: all .2s;
    transition: all .2s
}
.inner img.t0l0 {
    top: 0;
    left: 0
}
.inner img.t0r0 {
    top: 0;
    right: 0
}
.inner img.b0l0 {
    bottom: 0;
    left: 0
}
.inner img.b0r0 {
    bottom: 0;
    right: 0
}
.inner img.upside {
    transform: translate(0, -1100px);
    -webkit-transform: translate(0, -1100px);
    -moz-transform: translate(0, -1100px);
    -o-transform: translate(0, -1100px)
}
.inner img.under {
    transform: translate(0, 1000px);
    -webkit-transform: translate(0, 1000px);
    -moz-transform: translate(0, 1000px);
    -o-transform: translate(0, 1000px)
}
.inner img.leftside {
    transform: translate(-1100px, 0);
    -webkit-transform: translate(-1100px, 0);
    -moz-transform: translate(-1100px, 0);
    -o-transform: translate(-1100px, 0)
}
.inner img.rightside {
    transform: translate(1000px, 0);
    -webkit-transform: translate(1000px, 0);
    -moz-transform: translate(1000px, 0);
    -o-transform: translate(1000px, 0)
}
.inner img.sidelt {
    transform: translate(-1000px, -1000px);
    -webkit-transform: translate(-1000px, -1000px);
    -moz-transform: translate(-1000px, -1000px);
    -o-transform: translate(-1000px, -1000px)
}
.inner img.sidert {
    transform: translate(500px, -1000px);
    -webkit-transform: translate(500px, -1000px);
    -moz-transform: translate(500px, -1000px);
    -o-transform: translate(500px, -1000px)
}
.inner img.siderb {
    transform: translate(1000px, 500px);
    -webkit-transform: translate(1000px, 500px);
    -moz-transform: translate(1000px, 500px);
    -o-transform: translate(1000px, 500px);
    -ms-transform: translate(1000px, 500px)
}
.inner img.sidelb {
    transform: translate(-1000px, 500px);
    -webkit-transform: translate(-1000px, 500px);
    -moz-transform: translate(-1000px, 500px);
    -o-transform: translate(-1000px, 500px)
}
.sub_container ul li .inner img.web01_01 {
    width: 100%;
    z-index: 1
}
.sub_container ul li .inner img.web01_02 {
    width: 15%;
    z-index: 2;
    transition-delay: .1s
}
.sub_container ul li .inner img.web01_03 {
    width: 44.2622%;
    z-index: 2;
    transition-delay: .1s
}
.sub_container ul li .inner img.web01_04 {
    width: 33.0327%;
    z-index: 3;
    transition-delay: .2s
}
.sub_container ul li .inner img.web01_05 {
    width: 39.6721%;
    z-index: 3;
    transition-delay: .2s
}
.sub_container ul li .inner img.web01_06 {
    width: 33.0327%;
    z-index: 4;
    transition-delay: .3s
}
.sub_container ul li .inner img.web01_07 {
    width: 30.6557%;
    z-index: 4;
    transition-delay: .3s
}
.sub_container ul li .inner img.web02_01 {
    width: 60.6557%;
    z-index: 1
}
.sub_container ul li .inner img.web02_02 {
    width: 28.9344%;
    z-index: 2;
    transition-delay: .1s
}
.sub_container ul li .inner img.web02_03 {
    width: 75%;
    z-index: 2;
    transition-delay: .2s
}
.sub_container ul li .inner img.web03_01 {
    width: 72.1311%
}
.sub_container ul li .inner img.web03_02 {
    width: 19.836%;
    transition-delay: .1s
}
.sub_container ul li .inner img.web03_03 {
    width: 75%;
    transition-delay: .2s
}
.sub_container ul li .inner img.web03_04 {
    width: 75%;
    transition-delay: .3s
}
.sub_container ul li .inner img.web04_01 {
    width: 100%
}
.website_con03 .img_part {
    position: relative
}
.website_con03 .img_part .inner {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    overflow: hidden
}
.website_con03 .img_part .inner img {
    display: block;
    position: absolute;
    z-index: 10;
    -webkit-transition: all .2s;
    -moz-transition: all .2s;
    -o-transition: all .2s;
    -ms-transition: all .2s;
    transition: all .2s;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1)
}
.website_con03 .img_part .inner img.w03_01 {
    width: 47.418%;
    z-index: 1;
    transform: translate(-100%, 0)
}
.website_con03 .img_part .inner img.w03_02 {
    width: 47.213%;
    top: 0;
    left: 35.0819672131%;
    transition-delay: .1s;
    transform: translate(0, -1000%)
}
.website_con03 .img_part .inner img.w03_03 {
    width: 32.6639%;
    transition-delay: .2s;
    transform: translate(1000px, 0);
    -webkit-transform: translate(1000px, 0)
}
.website_con03 .img_part .inner img.w03_04 {
    width: 17.1311%;
    bottom: 0;
    left: 37.5%;
    transition-delay: .3s;
    transform: translate(0, 1000px);
    -webkit-transform: translate(0, 1000px)
}
.website_con03 .img_part .inner img.on {
    transform: translate(0, 0)
}
.website_con03 .img_part .inner img:hover {
    z-index: 11;
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -o-transform: scale(1);
    -ms-transform: scale(1.2);
    transform: scale(1.2)
}
.sub_container ul li .inner img.tanz {
    width: 47.295%
}
.sub_container ul li .inner img.mo01_01 {
    width: 20.3278%;
    z-index: 3
}
.sub_container ul li .inner img.mo01_02 {
    width: 36.5573%;
    z-index: 2;
    transition-delay: .2s
}
.sub_container ul li .inner img.mo01_03 {
    width: 55.8196%;
    z-index: 1;
    transition-delay: .3s
}
.sub_container ul li .inner img.mo01_06 {
    width: 48.7704%;
    z-index: 4;
    transition-delay: .4s
}
.sub_container ul li .inner img.mo01_04 {
    width: 44.2622%;
    z-index: 1;
    transition-delay: .2s
}
.sub_container ul li .inner img.mo01_07 {
    width: 27.9508%;
    z-index: 1
}
.sub_container ul li .inner img.mo02_01 {
    width: 100%;
    z-index: 1
}
.sub_container ul li .inner img.mo02_02 {
    width: 47.6229%;
    z-index: 2;
    transition-delay: .1s
}
.sub_container ul li .inner img.mo02_03 {
    width: 29.2622%;
    z-index: 3;
    transition-delay: .2s
}
.sub_container ul li .inner img.mo03_01 {
    width: 100%;
    z-index: 1
}
.sub_container ul li .inner img.mo03_02 {
    width: 45.5737%;
    transform: translate(800px, -500px);
    z-index: 2;
    transition-delay: .1s
}
.sub_container ul li .inner img.mo03_03 {
    width: 54.918%;
    transform: translate(-1000px, 500px);
    z-index: 3;
    transition-delay: .2s
}
.sub_container ul li .inner img.mo04_slide {
    transform: translate(-1000px, 1000px)
}
.sub_container ul li .inner img.mo04_01 {
    width: 52.7868%;
    z-index: 1
}
.sub_container ul li .inner img.mo04_02 {
    width: 58.2786%;
    z-index: 2;
    transition-delay: .1s
}
.sub_container ul li .inner img.mo04_03 {
    width: 45.7377%;
    z-index: 3;
    transition-delay: .2s
}
.sub_container ul li .inner img.mo04_04 {
    width: 58.2786%;
    z-index: 4;
    transition-delay: .3s
}
.sub_container ul li .inner img.mo04_05 {
    width: 16.3114%;
    z-index: 5;
    transition-delay: .3s
}
.sub_container ul li .inner img.de01_01 {
    width: 58.2786%;
    z-index: 1
}
.sub_container ul li .inner img.de01_02 {
    width: 77.459%;
    z-index: 2;
    transform: translate(-1000px, -500px);
    transition-delay: .1s
}
.sub_container ul li .inner img.de01_03 {
    width: 45.5737%;
    z-index: 3;
    transition-delay: .2s
}
.sub_container ul li .inner img.de01_04 {
    width: 44.6721%;
    z-index: 3;
    transition-delay: .3s
}
.sub_container ul li .inner img.de02_01 {
    width: 68.6065%;
    z-index: 3
}
.sub_container ul li .inner img.de02_02 {
    width: 81.4754%;
    z-index: 2;
    transition-delay: .1s
}
.sub_container ul li .inner img.de02_03 {
    width: 69.5081%;
    z-index: 1;
    transition-delay: .2s
}
.sub_container ul li .inner img.de02_04 {
    width: 71.6393%;
    z-index: 3;
    transition-delay: .3s
}
.sub_container ul li .inner img.de03_01 {
    width: 50%
}
.sub_container ul li .inner img.de03_02 {
    width: 50%;
    transition-delay: .1s
}
.sub_container ul li .inner img.de03_03 {
    width: 100%;
    transition-delay: .2s
}
.sub_container ul li .inner img.so01_01 {
    width: 75%;
    z-index: 1
}
.sub_container ul li .inner img.so01_02 {
    width: 50%;
    z-index: 2;
    transition-delay: .1s
}
.sub_container ul li .inner img.so01_03 {
    width: 34.2622%;
    z-index: 2;
    transition-delay: .2s
}
.sub_container ul li .inner img.so01_04 {
    width: 50%;
    z-index: 3;
    transition-delay: .3s
}
.sub_container ul li .inner img.so02_01 {
    width: 100%
}
.sub_container ul li .inner img.so02_02 {
    width: 74.918%;
    transition-delay: .1s
}
.sub_container ul li .inner img.so02_03 {
    width: 74.836%;
    transition-delay: .2s
}
.sub_container ul li .inner img.so02_04 {
    width: 70.9016%;
    transition-delay: .3s
}
.sub_container ul li .inner img.so03_01 {
    width: 100%;
    z-index: 1
}
.sub_container ul li .inner img.so03_02 {
    width: 49.6721%;
    z-index: 2;
    transition-delay: .1s
}
.sub_container ul li .inner img.so04_01 {
    width: 75%;
    z-index: 1
}
.sub_container ul li .inner img.so04_02 {
    width: 58.7704%;
    z-index: 2;
    -webkit-animation-duration: .8s;
    animation-duration: .8s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite
}
.sub_container ul li .inner img.ab01_01 {
    width: 50%;
    z-index: 1
}
.sub_container ul li .inner img.ab01_02 {
    width: 50%;
    z-index: 1;
    transition-delay: .1s
}
.sub_container ul li .inner img.ab01_03 {
    width: 100%;
    z-index: 2;
    transition-delay: .2s
}
.sub_container ul li .inner img.ab02_01 {
    width: 100%
}
.sub_container ul li .inner img.on {
    transform: translate(0, 0)
}
#member {
    padding: 3% 2%
}

@media all and (max-width:2120px) {
.dn2120 {
    display: none
}
}

@media all and (max-width:1800px) {
}

@media all and (max-width:1450px) {
.sub_visual ul li p {
    font-size: 1.8vw
}
.port_tab ul li {
    width: 16.666%
}
}

@media all and (max-width:1300px) {
.sub h4 {
    font-size: 46px
}
.sub .sub_text {
    font-size: 17px
}
.sub .sub_text p {
    font-size: 16px
}
.sub_container ul li.textPart span {
    font-size: 15px
}
.sub_container ul li.textPart h3 {
    font-size: 36px
}
.sub_container ul li.textPart h3.long {
    font-size: 70px
}
.sub_container ul li.textPart p {
    font-size: 14px;
    width: 100%
}
.sub_container ul li.textPart br {
    display: none
}
.sub_container ul li.textPart .last {
    font-size: 16px
}
.website_con02 ul li p {
    font-size: 26px
}
.software_con02 .inner_box h5 {
    font-size: 30px
}
.software_con02 .inner_box .soft_stext {
    font-size: 15px
}
.software_con02 .inner_box ul li h6 {
    font-size: 15px
}
.software_con02 .inner_box ul li p {
    font-size: 14px
}
.software_con02 .inner_box a {
    font-size: 14px;
    width: 13%
}
.software_con02 .inner_box a i {
    font-size: 17px
}
.contact_con01 h4 {
    margin-bottom: 50px;
    font-size: 35px
}
.contact_con01 ul li p {
    float: left;
    width: 11vw;
    line-height: 60px;
    font-size: 18px
}
.contact_con01 ul li>div {
    width: calc(100% - 11vw)
}
.contact_con01 ul li>div input {
    height: 60px;
    font-size: 14px
}
.contact_con01 textarea {
    font-size: 14px
}
.contact_con01 .agree_wrap input {
    width: 15px;
    height: 15px;
    font-size: 14px
}
.contact_con01 .agree_wrap label {
    font-size: 16px
}
.contact_con01 .agree_wrap a {
    font-size: 14px
}
.contact_con01 .btn a {
    font-size: 20px
}
.mobile_con02 ul li .text_t span {
    font-size: 14px
}
.server_con02 ul li .text_t span {
    font-size: 12px
}
.port_tab ul li {
    width: 26%;
    font-size: 12px
}
.port_tab ul li:nth-of-type(4) {
    border-top: 0;
    border-left: 1px solid #d6d6d6
}
.port_tab ul li:nth-of-type(5) {
    border-top: 0
}
.port_tab ul li:nth-of-type(6) {
    border-top: 0
}
}

@media all and (max-width:999px) {
.sub_visual {
    margin-bottom: 12%;
    margin-top: 0
}
.sub_visual ul {
    display: block
}
.sub_visual ul li {
    display: block;
    width: 100%
}
.sub_visual ul li:first-child {
    padding: 2% 2% 10%;
    overflow: hidden;
    box-sizing: border-box
}
.sub_visual ul li p {
    margin-top: 6%;
    font-size: 5vw;
    padding-right: 3%
}
.sub_container ul li {
    float: none;
    width: 100%
}
.sub_container.rightType ul li {
    float: none
}
.sub_container ul li.textPart {
    padding: 10% 4%
}
.sub_container ul li.textPart h3 {
    font-size: 36px
}
.sub_container ul li.textPart h3.long {
    font-size: 51px
}
.sub_container ul li.textPart h3.pdl {
    font-size: 57px
}
.sub h4 {
}
.sub .sub_text {
    margin-bottom: 5%;
    word-break: keep-all
}
.sub .sub_text p {
    margin-top: 1.2%
}
.website_con01 {
    margin-bottom: 15%
}
.website_con02 {
    margin-bottom: 15%
}
.website_con03 {
    margin-bottom: 15%
}
.website_con02 ul li {
    position: relative;
    float: none;
    width: 100%
}
.inner_type .container01 {
    margin-bottom: 10%
}
.mobile_con01 {
    margin-bottom: 15%
}
.mobile_con02 {
    margin-bottom: 15%
}
.mobile_con02 ul li {
    float: none;
    width: 100%
}
.mobile_con02 ul li .text_t {
    top: 5%
}
.mobile_con02 ul li .text_t h6 {
    font-size: 40px
}
.mobile_con02 ul li .text_t p {
    font-size: 36px
}
.mobile_con02 ul li .text_t span {
    font-size: 16px
}
.server_con01 {
    margin-bottom: 15%
}
.server_con02 {
    margin-bottom: 15%
}
.server_con02 ul li {
    float: none;
    width: 100%
}
.server_con02 ul li .text_t {
    top: 5%
}
.server_con02 ul li .text_t h6 {
    font-size: 40px
}
.server_con02 ul li .text_t p {
    font-size: 36px
}
.server_con02 ul li .text_t span {
    font-size: 16px
}
.container02 ul li {
    width: 50%
}
.software_con01 {
    margin-bottom: 15%
}
.software_con02 {
    margin-bottom: 15%
}
.software_con02 .inner_box {
    padding: 10% 0
}
.software_con02 .inner_box h5 {
    font-size: 27px;
    text-align: center;
    color: #fff;
    letter-spacing: -.025em
}
.software_con02 .inner_box .soft_stext {
    margin: 3% 1% 10%
}
.software_con02 .inner_box ul li {
    width: 42%
}
.software_con02 .inner_box ul li h6 {
    margin-bottom: 4%
}
.software_con02 .inner_box ul li p {
    margin-top: 5%;
    letter-spacing: -.07em;
    word-break: keep-all
}
.software_con02 .inner_box a {
    padding: 2% 0;
    width: 22%
}
.port_tab {
    margin: 5% 0 13%;
    padding: 0
}
.port_tab ul {
    overflow: hidden
}
.port_tab ul li {
    display: block;
    float: left;
    width: 16.666%;
    padding: 2% 0;
    font-size: 12px
}
.port_tab ul li.on {
    border: 0;
    padding: 2% 0
}
.port_tab ul li:first-child {
    padding: 2% 0
}
.port_tab ul li:nth-of-type(4) {
    border-top: 1px solid #d6d6d6;
    border-left: 0
}
.port_tab ul li:nth-of-type(5) {
    border-top: 1px solid #d6d6d6
}
.port_tab ul li:nth-of-type(6) {
    border-top: 1px solid #d6d6d6
}
.contact ul li:first-child {
    padding: 2% 2% 10%;
    width: 100%
}
.contact ul li:last-child {
    width: 100%
}
.contact ul li:first-child dl {
    width: 89%;
    padding-right: 0
}
.contact ul li:first-child dl dd {
    font-size: 4.8vw;
    line-height: 1.5
}
.contact ul li:first-child dl dt {
    width: 6%;
    margin: 0 2% 0 0
}
.contact ul li:first-child dl dd a {
    font-size: 5vw
}
.contact ul li:first-child dl dd a.num {
    font-size: 5.625vw
}
.contact ul li:first-child dl>span {
    display: block
}
.contact_con01 {
    padding: 9% 2% 12%;
    margin-bottom: 15%
}
.contact_con01 h4 {
    margin-bottom: 10%
}
.contact_con01 ul li {
    margin-bottom: 4%
}
.contact_con01 ul li.half {
    width: 100%
}
.contact_con01 ul li p {
    width: 28%;
    line-height: 45px;
    font-size: 16px
}
.contact_con01 ul li.no02 p {
    padding-left: 0
}
.contact_con01 ul li>div {
    float: left;
    width: calc(100% - 28%)
}
.contact_con01 ul li>div input {
    height: 45px
}
.contact_con01 textarea {
    resize: none;
    width: 100%;
    padding: 15px;
    box-sizing: border-box;
    border: 1px solid #d5d3d3
}
.contact_con01 .agree_wrap {
    padding: 4% 0
}
.contact_con01 .agree_wrap input {
    width: 14px;
    height: 14px
}
.contact_con01 .agree_wrap label {
}
.contact_con01 .agree_wrap a {
    padding: 2% 0;
    width: 22%
}
.contact_con01 .btn a {
    display: block;
    margin: 8% auto 0;
    padding: 2% 0;
    width: 30%
}
}

@media all and (max-width:600px) {
.port_tab ul {
    border-top: 1px solid #d6d6d6
}
.port_tab ul li {
    width: 33.333%;
    height: 27.5vw;
    font-size: 13px;
    border-top: 0
}
.port_tab ul li:nth-of-type(4) {
    border-top: 0;
    border-left: 1px solid #d6d6d6
}
.port_tab ul li:nth-of-type(5) {
    border-top: 0
}
.port_tab ul li:nth-of-type(6) {
    border-top: 0
}
.port_tab ul li img {
    margin: 0 auto 5%
}
.container02 ul li {
    width: 100%
}
}

@media all and (max-width:550px) {
.sub h4 {
    font-size: 28px
}
.website_con02 ul li p {
    font-size: 22px
}
.mobile_con02 ul li .text_t h6 {
    font-size: 24px
}
.mobile_con02 ul li .text_t p {
    position: relative;
    top: 0;
    margin-top: 11%;
    font-size: 16px
}
.mobile_con02 ul li .text_t span {
    font-size: 14px;
    line-height: 21px
}
.server_con02 ul li .text_t h6 {
    font-size: 24px
}
.server_con02 ul li .text_t p {
    position: relative;
    top: 0;
    margin-top: 11%;
    font-size: 16px
}
.server_con02 ul li .text_t span {
    font-size: 14px;
    line-height: 21px
}
.software_con02 .inner_box ul li p {
    font-size: 12px
}
.software_con02 .inner_box a {
    padding: 4% 0;
    width: 35%
}
.contact_con01 .btn a {
    padding: 4% 0;
    width: 45%
}
}

@media all and (max-width:330px) {
.sub_container ul li.textPart h3 {
    font-size: 36px
}
}
.mb7 {
    margin-bottom: 7px!important
}
.mb20 {
    margin-bottom: 20px!important
}
.mb24 {
    margin-bottom: 24px!important
}
.mb25 {
    margin-bottom: 25px!important
}
.mb27 {
    margin-bottom: 27px!important
}
.mb30 {
    margin-bottom: 30px!important
}
.mb35 {
    margin-bottom: 35px!important
}
.mb38 {
    margin-bottom: 38px!important
}
.mb40 {
    margin-bottom: 40px!important
}
.mb42 {
    margin-bottom: 42px!important
}
.mb45 {
    margin-bottom: 45px!important
}
.mb48 {
    margin-bottom: 48px!important
}
.mb50 {
    margin-bottom: 50px!important
}
.mb60 {
    margin-bottom: 60px!important
}
.mb65 {
    margin-bottom: 65px!important
}
.mb80 {
    margin-bottom: 80px!important
}
.mappt400 {
    padding-top: 400px!important
}
.tc {
    text-align: center
}
.tl {
    text-align: left!important
}
.tr {
    text-align: right!important
}
.font15 {
    font-size: 15px
}
.font17 {
    font-size: 17px
}
.font18 {
    font-size: 18px;
    letter-spacing: -.4px
}
.font20 {
    font-size: 20px;
    letter-spacing: -.4px
}
.font22 {
    font-size: 22px;
    letter-spacing: -1px
}
.font30 {
    font-size: 30px;
    letter-spacing: -1px
}
.btnZone {
    overflow: hidden;
    position: relative;
    width: 100%
}
.btnZone .btnLeft {
    float: left
}
.btnZone .btnRight {
    float: right
}
.btnZone.bottom {
    margin-bottom: 100px
}
.btnZone.bottom .btnLeft {
    width: 4.875%
}
.btnZone.bottom .right_wrap {
    position: absolute;
    right: 0;
    top: 0;
    width: 9.75%;
    font-size: 0
}
.btnZone.bottom .right_wrap a {
    display: inline-block;
    width: 50%
}
.more_btn {
    text-align: center;
    margin-top: 20px
}
.btnC {
    position: relative;
    text-align: center;
    padding: 0;
    clear: both;
    width: 100%;
    vertical-align: middle
}
#bbs .btnC .btnAll {
    width: 98%;
    margin: 0 1px;
    text-align: center;
    vertical-align: middle
}
.portfolioRead {
    position: relative;
    max-width: 1600px;
    margin: 0 auto
}
.portfolioRead img {
    width: 100%
}
.portfolioRead .topZone {
    position: relative;
    width: 100%;
    margin: 0 0 60px
}
.portfolioRead .topZone dl {
    text-align: center
}
.portfolioRead .topZone dl dt {
    font-size: 1.875vw;
    color: #333;
    padding: 0 10%;
    letter-spacing: -1px
}
.portfolioRead .topZone dl dd {
    font-size: 14px;
    color: #86888b;
    padding: 0 10%;
    margin-top: 5px
}
.portfolioRead .topZone .list_btn {
    position: absolute;
    left: 0;
    top: 0;
    width: 4.875%
}
.portfolioRead .topZone .list_control_btn {
    position: absolute;
    right: 0;
    top: 0;
    width: 9.75%;
    font-size: 0;
    text-align: right
}
.portfolioRead .topZone .list_control_btn a {
    display: inline-block;
    width: 50%
}
.portfolioRead .detail {
    margin: 0 0 48px;
    padding: 0 0 46px;
    border-bottom: 1px solid #dedede
}
.portfolioRead .detail ul {
    overflow: hidden;
    margin: 0 0 57px
}
.portfolioRead .detail ul li {
    float: left;
    margin: 0 12px 0 0;
    padding: 0 0 0 12px;
    background: url(../images/portfolioRead_bar.gif) no-repeat left center
}
.portfolioRead .detail ul li.first {
    padding-left: 0;
    background: 0 0
}
.portfolioRead .detail ul li a {
    color: #656565
}
.noticList ul li {
    clear: both;
    width: calc(100% - 20px);
    min-height: 80px;
    margin: 0 10px 10px;
    padding: 0 0 10px;
    border-bottom: 1px solid #e2e2e2
}
.noticList a.bgA {
    display: block;
    width: 100%;
    min-height: 90px;
    background: url(../images/noticList_off.gif) no-repeat center right
}
.info_div1 ul.ul_prt_parent>li>a {
    display: block;
    overflow: hidden
}
.noticList ul li span.num {
    float: left;
    display: block;
    height: 80px;
    line-height: 80px;
    color: #bdbdbd;
    font-size: 47px;
    font-style: oblique;
    text-align: center;
    letter-spacing: -1px;
    margin-right: 30px;
    color: #e3185c
}
.noticList ul li .noticList_txtWrap {
    float: left;
    margin-top: 10px
}
.noticList ul li span.day {
    display: block;
    color: #bdbdbd;
    font-size: 14px;
    font-style: normal;
    margin-top: 10px
}
.noticList ul li span.subject {
    display: block;
    width: 100%;
    height: 35px;
    font-size: 20px;
    color: #333;
    line-height: 35px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}
.noticList ul li .noticList_txtWrap02 {
    width: calc(100% - 60px);
    height: 80px;
    line-height: 80px;
    overflow: hidden;
    margin-top: 0
}
.noticList ul li .noticList_txtWrap02>span {
    display: inline-block
}
.noticList ul li .noticList_txtWrap02 span.subject {
    width: calc(100% - 95px);
    height: 80px;
    line-height: 80px
}
.noticList ul li .noticList_txtWrap02 span.day {
    float: right;
    line-height: 80px;
    width: 80px;
    margin-left: 10px;
    text-align: right;
    margin-top: 0
}
.noticList ul .current {
    width: 94%;
    font-size: 115%;
    color: #666;
    padding: 2%
}
.noticList ul li.active>a.bgA {
    background: url(../images/noticList_on.gif) no-repeat center right
}
.noticList ul li.active span.num {
    color: #000
}
.noticList ul li.active span.num span.day {
    color: #000
}
.noticList ul li.active span.subject {
    color: #000
}
.noticList img {
    max-width: 100%
}

@media all and (max-width:1300px) {
.portfolioRead .topZone dl dt {
    font-size: 24px;
    word-break: keep-all
}
.portfolioRead .topZone dl dd {
    font-size: 14px
}
}

@media all and (max-width:999px) {
#content {
    margin-top: 20px
}
.btnZone {
    display: none
}
.btnZone.bottom .btnLeft {
    width: 10%
}
.btnZone.bottom .right_wrap {
    width: 20%
}
.portfolioRead .topZone dl dt {
    padding: 0 10%
}
.portfolioRead .topZone dl dd {
    padding: 0 10%
}
.portfolioRead .topZone .list_btn {
    width: 10%
}
.portfolioRead .topZone .list_control_btn {
    width: 20%
}
.portfolioRead .detail ul li a {
    font-size: 13px
}
.portfolioRead .detail ul li {
    padding: 0
}
.noticList ul li {
    clear: both;
    width: 100%;
    min-height: 50px;
    margin: 0;
    padding: 0 0 10px
}
.noticList ul li span.num {
    height: 50px;
    line-height: 50px;
    color: #bdbdbd;
    font-size: 14px;
    font-style: oblique;
    text-align: center;
    letter-spacing: -1px;
    margin-right: 10px
}
.noticList ul li .noticList_txtWrap {
    float: left;
    margin-top: 10px
}
.noticList ul li span.day {
    display: block;
    color: #bdbdbd;
    font-size: 14px;
    font-style: normal;
    margin-top: 10px
}
.noticList ul li span.subject {
    height: 35px;
    font-size: 14px;
    color: #777;
    line-height: 35px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}
.noticList ul li .noticList_txtWrap02 {
    width: calc(100% - 40px);
    height: 50px;
    line-height: 50px;
    overflow: hidden;
    margin-top: 0
}
.noticList ul li .noticList_txtWrap02>span {
    display: inline-block
}
.noticList ul li .noticList_txtWrap02 span.subject {
    width: calc(100% - 95px);
    height: 50px;
    line-height: 50px
}
.noticList ul li .noticList_txtWrap02 span.day {
    float: right;
    line-height: 50px;
    width: 80px;
    margin-left: 10px;
    text-align: right;
    margin-top: 0
}
.noticList ul .current {
    width: 94%;
    font-size: 115%;
    color: #666;
    padding: 2%
}
.noticList ul li.active>a.bgA {
    background: url(../images/noticList_on.gif) no-repeat center right
}
.noticList ul li.active span.num {
    color: #000
}
.noticList ul li.active span.num span.day {
    color: #000
}
.noticList ul li.active span.subject {
    color: #000
}
.noticList img {
    max-width: 100%
}
.btnOver>a {
    display: inline-block;
    margin-top: 3%;
    width: 26%
}
.btnOver>a>img {
    width: 100%
}
}
.yzm {
    position: relative
}
.yzm img.hand {
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 999;
    width: 150px;
    cursor: pointer
}

@media all and (max-width:999px) {
.yzm img.hand {
    position: absolute;
    right: 10px;
    top: 10px;
    z-index: 999;
    width: 100px;
    cursor: pointer
}
}
.w95 {
    padding: 3%;
    background: #f6f6f6;
    width: 92%;
    margin-bottom: 20px
}
.weblinks {
    background: #171717;
    padding: 20px 30px;
    color: #999;
    font-size: 14px;
    border-top: 1px solid #272727
}
.weblinks a {
    color: #666;
    padding-right: 5px
}